

<script id="tpl-spec-group" type="text/html">
    {{# for(var i in d.data){ }}
    <tr>
        <td data-label="">
            <span class="am-vertical-align-middle"><span class="am-input-group "><input type="text" class="spec-name" value="{{d.data[i].name}}"><a class="am-input-group-label am-text-danger spec-del" href="javascript:;"><i class="am-icon-times"></i></a></span>
        </td>
        <td class="am-vertical-align spec-list">
            {{# var items = d.data[i].value.split(','); }}
            {{# for(var x in items){ }}
            <span class="list-item am-vertical-align-middle"><span class="am-input-group "><span class="am-input-group-label"><input type="checkbox" {{d.checkbox ? 'checked' : ''}}></span><input value="{{items[x]}}" type="text" class="am-form-field"><a class="am-input-group-label am-text-danger spec-value-del" href="javascript:;"><i class="am-icon-times"></i></a></span></span>
            {{# } }}
            <span  class=" list-add am-vertical-align-middle"><button class="am-btn am-btn-primary js-spec-value" type="button">添加</button></span>
        </td>
    </tr>
    {{# } }}
</script>

<script id="tpl-spec-value" type="text/html">
    <span class="list-item am-vertical-align-middle"><span class="am-input-group "><span class="am-input-group-label"><input type="checkbox"></span><input value="{{d.value}}" type="text" class="am-form-field"><a class="am-input-group-label am-text-danger spec-value-del" href="javascript:;"><i class="am-icon-times"></i></a></span></span>
</script>


<script>
    var defaultProductNo = '{$productNo}';
    var proDataJson = {$proDataJson};
    var proHeadJson = {$proHeadJson};
    var specJson = {$specJson};
    Do('base', 'select', 'tpl', 'dialog', function () {

        /**
         * 添加规格
         */
        $('#add-spec-group').on('click', function () {
            layer.prompt({title: '输入规格名'}, function (text, index) {
                layer.close(index);

                var gettpl = $('#tpl-spec-group').html();
                var data = [
                    {
                        "name" : text,
                        "value" : ''
                    }
                ];
                laytpl(gettpl).render({data : data, checkbox : false}, function (html) {
                    $('.dux-spec-group').append(html);
                });
            });
        });
        $('.dux-spec-group').on('click', '.spec-del', function () {
            $(this).parents('tr').remove();
        });


        /**
         * 添加规格值
         */
        $('.dux-spec-group').on('click', '.js-spec-value', function () {
            var $el = $(this);
            layer.prompt({title: '添加规格值'}, function (text, index) {
                layer.close(index);
                var gettpl = $('#tpl-spec-value').html();
                laytpl(gettpl).render({"value" : text}, function (html) {
                    $el.parent().before(html);
                });
            });
        });

        $('.dux-spec-group').on('click', '.spec-value-del', function () {
            $(this).parents('.list-item').remove();
        });

        /**
         * 获取分类规格
         */
        $('#class_id').on('select2:select', function () {
            classSpec();
        });

        /**
         *  获取栏目属性
         */
        var classSpec = function() {
            app.ajax({
                url: '{url("getSpec")}?class_id=' + $('#class_id').val() + '&app={$urlApp}',
                type: 'post',
                success: function (data) {
                    if(data == 'OK') {
                        return;
                    }
                    var gettpl = $('#tpl-spec-group').html();
                    laytpl(gettpl).render({data : data, checkbox : false}, function (html) {
                        $('.dux-spec-group').html(html);
                    });
                }
            });
            app.ajax({
                url: '{url("getFilterHtml")}?class_id=' + $('#class_id').val() + '&app={$urlApp}&content_id={$info.content_id}&type=1',
                type: 'post',
                success: function (html) {
                    if(html == 'OK') {
                        return;
                    }
                    $('.filter-body').html(html);
                }
            });
        };

        var initSpec = function () {
            var gettpl = $('#tpl-spec-group').html();
            laytpl(gettpl).render({data : specJson, checkbox : true}, function (html) {
                $('.dux-spec-group').html(html);
            });
        };


        if($.isEmptyObject(specJson)) {
            classSpec();
        } else {
            initSpec();
        }

        /**
         * 选择规格
         */
        $('.dux-spec-group').on('click', 'input[type="checkbox"]', function () {
            createSpecData();
        });
        $('.dux-spec-group').on('blur', 'input[type="text"]', function () {
            createSpecData();
        });

        var createSpecData = function () {

            var specValueData = {};
            var specData = {};
            $('.dux-spec-group').find('tr').each(function (i) {
                specData[i] = {id : i, name : $(this).find('.spec-name').val()};
                specValueData[i] = [];
                $(this).find('input[type="checkbox"]:checked').each(function () {
                    var value = $(this).parents('.list-item').find('input[type="text"]').val();
                    if(value) {
                        specValueData[i].push(value);
                    }
                });
            });
            if(specValueData.length < 1) {
                return ;
            }

            for(var i in specValueData){
                if(specValueData[i].length < 1) {
                    delete specData[i];
                    delete specValueData[i];
                }
            }

            var specMaxData = descartes(specValueData, specData);

            addData(specData, {
                spec_list: specMaxData
            });


        };

        var descartes = function(list, specData) {
            //parent上一级索引;count指针计数
            var point = {};
            var result = [];
            var pIndex = null;
            var tempCount = 0;
            var temp = [];

            //根据参数列生成指针对象
            for (var index in list) {
                if (typeof list[index] == 'object') {
                    point[index] = {'parent': pIndex, 'count': 0};
                    pIndex = index;
                }
            }
            //单维度数据结构直接返回
            if (pIndex == null) {
                return list;
            }
            //动态生成笛卡尔积
            while (true) {
                for (var index in list) {
                    tempCount = point[index]['count'];
                    temp.push({
                        "id": specData[index].id,
                        "name": specData[index].name,
                        "value": list[index][tempCount]
                    });
                }

                //压入结果数组
                result.push(temp);
                temp = [];
                //检查指针最大值问题
                while (true) {
                    if (point[index]['count'] + 1 >= list[index].length) {
                        point[index]['count'] = 0;
                        pIndex = point[index]['parent'];
                        if (pIndex == null) {
                            return result;
                        }

                        //赋值parent进行再次检查
                        index = pIndex;
                    }
                    else {
                        point[index]['count']++;
                        break;
                    }
                }
            }
        };

        /**
         * 添加商品规格
         * @param head
         * @param data
         * @returns {boolean}
         */
        window.addData = function addData(head, data) {
            if ($.isEmptyObject(data.spec_list)) {
                addDefaultData();
                return false;
            }
            data = $.extend({
                id: {},
                goods_no: {},
                store: {},
                sell_price: {},
                market_price: {},
                cost_price: {},
                weight: {},
                spec_list: {}
            }, data);
            var gettpl = $('#tpl-spec').html();
            laytpl(gettpl).render({data: data, head: head}, function (html) {
                $('.js-data-list').html(html);
            });
        };
        $('.js-data-list').on('click', '.js-del', function () {
            if ($('.js-data-list tbody').find('tr').length > 1) {
                $(this).parents('tr').remove();
            } else {
                addDefaultData();
            }
        });
        function addDefaultData() {
            var gettpl = $('#tpl-spec-default').html();
            laytpl(gettpl).render({no: defaultProductNo}, function (html) {
                $('.js-data-list').html(html);
            });
        }

        if ($.isEmptyObject(proDataJson)) {
            addDefaultData();
        } else {
            addData(proHeadJson, proDataJson);
        }

        /**
         * 批量设置
         */
        $('.js-data-list').on('click', '.spec-value-set', function () {
            var $el = $(this), i = $el.parent().index();
            layer.prompt({title: '批量设置'}, function (text, index) {
                layer.close(index);
                $('.js-data-list').find('tr').each(function () {
                    $(this).find('td').eq(i).find('input[type="text"]').val(text);
                });
            });

        });

    });
</script>